<template>
    <view class="content">



        <view class="area-box">

            <view class="fhc item" style="padding: 20rpx 0;">
                <view class="title">员工类型</view>
                <picker @change="returnPickerType2" :value="type2" range-key="name" :range="types2">
                    <view class="picker">
                        {{types2[type2]?types2[type2].name:'请选择员工类型'}}
                    </view>
                </picker>
            </view>

            <view class="fhc item" style="padding: 20rpx 0;">
                <view class="title">视频类型</view>
                <picker @change="returnPickerType" :value="type" range-key="name" :range="types">
                    <view class="picker">
                        {{types[type]?types[type].name:'请选择视频类型'}}
                    </view>
                </picker>
            </view>

            <view class="fhc item" style="padding: 20rpx 0;">
                <view class="title">视频标题</view>
                <input class="input" v-model="title" placeholder="请输入视频标题"></input>
            </view>
            <view class="fhc item" style="padding: 20rpx 0;">
                <view class="title">网盘地址</view>
                <input class="input" v-model="url" placeholder="请输入网盘地址"></input>
            </view>
            <view class="fhc item" style="padding: 20rpx 0;">
                <view class="title">提取码</view>
                <input class="input" v-model="tqm" placeholder="请输入提取码"></input>
            </view>

            <view class="pt20 pb20" v-if="0">
                <view class="pb20 title">请上传视频封面</view>
                <view class="fw" style="gap: 20rpx;">
                    <image src="/static/up.png" class="img" @click="upImg"></image>
                    <image :src="img" class="img"></image>
                </view>
            </view>

            <view class="pt20 pb20" v-if="0">
                <view class="pb20 title">请上传视频</view>
                <view class="fw" style="gap: 20rpx;">
                    <image src="/static/up.png" class="img" @click="upVideo"></image>
                </view>
            </view>

            <video v-if="video" :src="video" class="video"></video>
        </view>

        <div class="common-btn">
            <button class="cu-btn block bg-green margin-tb-sm lg" @click="submit">保存</button>
        </div>
    </view>
</template>

<script>
    import api from '@/api/api.js';
    export default {
        data() {
            return {
                video: '',
                title: '',
                img: '',
                url: '',
                tqm: '',
                type: '',
                types: [
                    { id: 1, name: '业务员' },
                    { id: 2, name: '贷后' },
                    { id: 3, name: '执行' },
                    { id: 4, name: '其他' },
                ],
                type2: '',
                types2: [
                    { id: 1, name: '新员工' },
                    { id: 2, name: '老员工' },
                ],
            }
        },
        onLoad(o) {

        },
        methods: {
            returnPickerType(e) {
                console.log(e);
                this.type = e.detail.value
            },
            returnPickerType2(e) {
                console.log(e);
                this.type2 = e.detail.value
            },
            upImg() {
                uni.chooseImage({
                    count: 1,
                    success: (r) => {
                        console.log(r);
                        let filePath = r.tempFilePaths[0]
                        uni.uploadFile({
                            url: `https://www.jyjkyqhl.com:7778/app/common/upload`,
                            filePath,
                            name: 'file',
                            success: (r) => {
                                console.log(r, JSON.parse(r.data));
                                this.img = JSON.parse(r.data).url
                            },
                            complete: (e) => {
                                console.log('eee', e);
                            }
                        })
                    }
                })
            },
            upVideo() {
                uni.chooseVideo({
                    count: 1,
                    success: (r) => {
                        console.log(r);
                        let filePath = r.tempFilePath
                        uni.uploadFile({
                            url: `https://www.jyjkyqhl.com:7778` + '/app/common/upload',
                            filePath,
                            name: 'file',
                            success: (r) => {

                                console.log(r, JSON.parse(r.data));
                                this.video = JSON.parse(r.data).url

                            },
                            complete: (e) => {
                                console.log('eee', e);
                            }
                        })
                    }
                })
            },
            async submit() {
                if (this.type2 === '') return this.toast(`请选择员工类型`)
                if (this.type === '') return this.toast(`请选择视频类型`)
                if (!this.title) return this.toast(`请输入视频标题`)
                if (!this.url) return this.toast(`请输入网盘地址`)
                if (!this.tqm) return this.toast(`请输入提取码`)
                // if (!this.img) return this.toast(`请上传视频封面`)
                // if (!this.video) return this.toast(`请上传视频`)

                uni.showModal({
                    content: `确定提交视频吗?`,
                    success: (r) => {
                        if (r.confirm) {
                            api.addVideo({
                                netUrl: this.url,
                                netPassword: this.tqm,
                                videoType: this.type2 + 1,
                                type: this.types[this.type].id,
                                videoUrl: this.video,
                                content: this.title,
                                title: this.img,
                            }).then(r => {
                                this.toast(`提交成功`)
                                setTimeout(_ => {
                                    uni.navigateBack({ delta: 1 })
                                }, 1800)
                            })
                        }
                    }
                })

            },
        }
    }
</script>

<style lang="scss">
    page {
        height: 100%;
        background-color: #fff;
    }

    .checkBox {
        display: flex;
        align-items: center;
        margin-bottom: 20rpx;

        switch {
            margin-left: 20rpx;
        }
    }

    .content {
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        .area-box {
            margin-top: 20upx;
            padding: 20upx 24upx;
            background: #fff;

            textarea {
                width: 100%;
                height: 200upx;
                border: 1px solid #f7f7f7;
                border-radius: 8upx;
                padding: 20upx;
            }
        }

    }

    .img {
        width: 220rpx;
        height: 220rpx;
        position: relative;

        .close {
            position: absolute;
            width: 40rpx;
            height: 40rpx;
            position: absolute;
            right: 6rpx;
            top: 6rpx;
            z-index: 999;
        }
    }

    .item {
        border-bottom: 1px solid #eee;

        .title {
            font-size: 28rpx;
            font-weight: 600;
            margin-right: 20rpx;
        }

        .input {
            font-size: 28rpx;
        }
    }

    .video {
        width: 100%;
    }
</style>